<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<title>Ready Bootstrap Dashboard</title>
	<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
	<link rel="stylesheet" href="assets/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i">
	<link rel="stylesheet" href="assets/css/ready.css">
	<link rel="stylesheet" href="assets/css/demo.css">
	<link rel="stylesheet" href="assets/css/mystyle.css">
</head>
<body>
	<div class="wrapper">
		<div class="main-header">
			<div class="logo-header">
				<a href="index.html" class="logo">
					路桥监测系统
				</a>
				<button class="navbar-toggler sidenav-toggler ml-auto" type="button" data-toggle="collapse" data-target="collapse" aria-controls="sidebar" aria-expanded="false" aria-label="Toggle navigation">
					<span class="navbar-toggler-icon"></span>
				</button>
				<button class="topbar-toggler more"><i class="la la-ellipsis-v"></i></button>
			</div>
			<nav class="navbar navbar-header navbar-expand-lg">
				<div class="container-fluid">
					<ul class="navbar-nav topbar-nav ml-md-auto align-items-center">
						<li class="nav-item dropdown hidden-caret">
							<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								<i class="la la-envelope"></i>
							</a>
							<div class="dropdown-menu" aria-labelledby="navbarDropdown">
								<a class="dropdown-item" href="#">Action</a>
								<a class="dropdown-item" href="#">Another action</a>
								<div class="dropdown-divider"></div>
								<a class="dropdown-item" href="#">Something else here</a>
							</div>
						</li>
						<li class="nav-item dropdown hidden-caret">
							<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								<i class="la la-bell"></i>
								<span class="notification">3</span>
							</a>
							<ul class="dropdown-menu notif-box" aria-labelledby="navbarDropdown">
								<li>
									<div class="dropdown-title">You have 4 new notification</div>
								</li>
								<li>
									<div class="notif-center">
										<a href="#">
											<div class="notif-icon notif-primary"> <i class="la la-user-plus"></i> </div>
											<div class="notif-content">
												<span class="block">
													New user registered
												</span>
												<span class="time">5 minutes ago</span>
											</div>
										</a>
										<a href="#">
											<div class="notif-icon notif-success"> <i class="la la-comment"></i> </div>
											<div class="notif-content">
												<span class="block">
													Rahmad commented on Admin
												</span>
												<span class="time">12 minutes ago</span>
											</div>
										</a>
										<a href="#">
											<div class="notif-img">
												<img src="assets/img/profile2.jpg" alt="Img Profile">
											</div>
											<div class="notif-content">
												<span class="block">
													Reza send messages to you
												</span>
												<span class="time">12 minutes ago</span>
											</div>
										</a>
										<a href="#">
											<div class="notif-icon notif-danger"> <i class="la la-heart"></i> </div>
											<div class="notif-content">
												<span class="block">
													Farrah liked Admin
												</span>
												<span class="time">17 minutes ago</span>
											</div>
										</a>
									</div>
								</li>
								<li>
									<a class="see-all" href="javascript:void(0);"> <strong>See all notifications</strong> <i class="la la-angle-right"></i> </a>
								</li>
							</ul>
						</li>
						<li class="nav-item dropdown">
							<a class="dropdown-toggle profile-pic" data-toggle="dropdown" href="#" aria-expanded="false"> <img src="assets/img/profile.jpg" alt="user-img" width="36" class="img-circle"><span >Dragon</span></span> </a>
							<ul class="dropdown-menu dropdown-user">
								<li>
									<div class="user-box">
										<div class="u-img"><img src="assets/img/profile.jpg" alt="user"></div>
										<div class="u-text">
											<h4>Dragon</h4>
											<p class="text-muted">dragongao@outlook.com</p><a href="profile.html" class="btn btn-rounded btn-danger btn-sm">View Profile</a></div>
										</div>
									</li>
									<div class="dropdown-divider"></div>
									<a class="dropdown-item" href="#"><i class="ti-user"></i> My Profile</a>
									<a class="dropdown-item" href="#"></i> My Balance</a>
									<a class="dropdown-item" href="#"><i class="ti-email"></i> Inbox</a>
									<div class="dropdown-divider"></div>
									<a class="dropdown-item" href="#"><i class="ti-settings"></i> 账户设置</a>
									<div class="dropdown-divider"></div>
									<a class="dropdown-item" href="#"><i class="fa fa-power-off"></i> 注销</a>
								</ul>
								<!-- /.dropdown-user -->
							</li>
						</ul>
					</div>
				</nav>
			</div>
			<div class="sidebar">
				<div class="scrollbar-inner sidebar-wrapper">
					<div class="user">
						<div class="photo">
							<img src="assets/img/profile.jpg">
						</div>
						<div class="info">
							<a class="" data-toggle="collapse" href="#collapseExample" aria-expanded="true">
								<span>
									Dragon
									<span class="user-level">Admin</span>
									<span class="caret"></span>
								</span>
							</a>
							<div class="clearfix"></div>

							<div class="collapse in" id="collapseExample" aria-expanded="true" style="">
								<ul class="nav">
									<li>
										<a href="#profile">
											<span class="link-collapse">My Profile</span>
										</a>
									</li>
									<li>
										<a href="#edit">
											<span class="link-collapse">Edit Profile</span>
										</a>
									</li>
									<li>
										<a href="#settings">
											<span class="link-collapse">设置</span>
										</a>
									</li>
								</ul>
							</div>
						</div>
					</div>
					<ul class="nav">
						<li class="nav-item">
							<a href="index.html">
								<i class="la la-home"></i>
								<p>首页</p>
							</a>
						</li>
						<li class="nav-item">
							<a href="#user" data-toggle="collapse" aria-expanded="true">
								<i class="la la-users"></i>
								<p>用户组管理</p>
								<span class="caret"></span>
							</a>
							<div class="clearfix"></div>
							<div class="collapse in" id="user" aria-expanded="true" style="">
								<ul class="nav-item">
									<li class="my-nav-item">
										<a href="useradd.html">
											<span class="link-collapse">用户管理</span>
										</a>
									</li>
									<!-- <li class="my-nav-item">
										<a href="useredit.html">
											<span class="link-collapse">用户修改</span>
										</a>
									</li> -->
									<li class="my-nav-item">
										<a href="groupadd.html">
											<span class="link-collapse">分组管理</span>
										</a>
									</li>
								</ul>
							</div>
						</li>
						<li class="nav-item">
							<a href="#setting" data-toggle="collapse" aria-expanded="true">
								<i class="la la-edit"></i>
								<p>系统设置</p>
								<span class="caret"></span>
							</a>
							<div class="clearfix"></div>
							<div class="collapse in" id="setting" aria-expanded="true" style="">
								<ul>
									<li class="my-nav-item">
										<a href="yuzhiedit.html">
											<span class="link-collapse">阈值设置</span>
										</a>
									</li>
									<li class="my-nav-item">
										<a href="baojingsetting.html">
											<span class="link-collapse">报警设置</span>
										</a>
									</li>
									<li class="my-nav-item">
										<a href="tongzhi.html">
											<span class="link-collapse">发布通知</span>
										</a>
									</li>
								</ul>
							</div>
						</li>
						<li class="nav-item">
							<a href="#log" data-toggle="collapse" aria-expanded="true">
								<i class="la la-edit"></i>
								<p>报表管理</p>
								<span class="caret"></span>
							</a>
							<div class="clearfix"></div>
							<div class="collapse in" id="log" aria-expanded="true" style="">
								<ul class="nav-item">
									<li class="my-nav-item">
										<a href="baobiao.html">
											<span class="link-collapse">报表查看</span>
										</a>
									</li>
									<li class="my-nav-item">
										<a href="#edit">
											<span class="link-collapse">报表上传</span>
										</a>
									</li>
								</ul>
							</div>
						</li>
						<li class="nav-item">
		                    <a href="qiaoinformation.html">
		                        <i class="la la-info"></i>
		                        <p>桥梁监测</p>
		                    </a>
                		</li>
					</ul>
				</div>
			</div>
			<div class="main-panel">
				<div class="content">
					<div class="container-fluid">
						<h4 class="page-title">用户添加</h4>
						<div class="row">
							<div class="col-md-8">
								<div class="card">
									<div class="card-header">
										<div class="card-text text-left">选择分组和人数（批量）</div>
									</div>
									<div class="card-body">
										<div class="row">
											<div class="col-md-5">
											<select class="form-control input-fixed" id="user_group">
												<option value="桥梁监测组">桥梁监测组</option>
												<option value="政府人员">政府人员</option>
												<option value="游客">游客</option>
											</select>
											</div>
											<div class="col-md-5">
												<input type="number" class="form-control" placeholder="5" id="userNumber">
											</div>
											<div class="col-md-2">
												<button class="btn btn-primary btn-round" id="generateUser">生成</button>
											</div>
										</div>
									</div>
								</div>
							</div>
							<div class="col-md-4">
								<div class="card">
									<div class="card-header">
										<div class="card-text text-center">单用户添加</div>
									</div>
									<div class="card-body">
										<!-- <div class="row">
											<div class="col-md-9">
											<div class="">
												<input type="file" class="form-control-file">
											</div>
										</div> -->
											<div class="col-md-12 text-center">
												<button class="btn btn-primary btn-round" data-toggle="modal" data-target="#AddUser">ADD</button>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="row">
							<div class="col-md-12">
								<div class="card">
									<div class="card-header">
										<div class="card-title text-center">用户列表</div>
										<form class="form-inline pull-right" action="">
													<div class="input-group">
														<input type="text" placeholder="Search ..." class="form-control">
														<div class="input-group-append">
															<span class="input-group-text">
																<i class="la la-search search-icon"></i>
															</span>
														</div>
													</div>
										</form>
									</div>
									<div class="card-body">
										<table class="table table-hover">
											<thead>
											<tr>
												<th scope="col">ID</th>
												<th scope="col">用户名</th>
												<th scope="col">生成时间</th>
												<th scope="col">上次登陆</th>
												<th scope="col">所属组</th>
												<th scope="col">操作</th>>
											</tr>
											</thead>
											<tbody>
											<tr>
												<!-- <td>
													<label class="form-check-label">
														<input class="form-check-input" type="checkbox" value="">
														<span class="form-check-sign"></span>
													</label>
												</td> -->
												<td><p>1</p></td>
												<td><p>dragon</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td>桥梁监测组</td>
												<td>
													<a href="# " class="btn btn-primary" data-toggle="modal" data-target="#UpdateUser">修改</a>
													<a href="# " class="btn btn-primary" data-toggle="modal" data-target="#DeleteUser">删除</a>
												</td>
											</tr>
											<tr>
												<td><p>2</p></td>
												<td><p>dragon</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td>桥梁监测组</td>
												<td>
														<a href="# " class="btn btn-primary">修改</a>
														<a href="# " class="btn btn-primary">删除</a>
												</td>
											</tr>
											<tr>
												<td><p>3</p></td>
												<td><p>dragon</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td>桥梁监测组</td>
												<td>
														<a href="# " class="btn btn-primary">修改</a>
														<a href="# " class="btn btn-primary">删除</a>
												</td>
											</tr>
											<tr>
												<td><p>4</p></td>
												<td><p>dragon</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td>桥梁监测组</td>
												<td>
														<a href="# " class="btn btn-primary">修改</a>
														<a href="# " class="btn btn-primary">删除</a>
												</td>
											</tr>
											<tr>
												<td><p>5</p></td>
												<td><p>dragon</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td>桥梁监测组</td>
												<td>
														<a href="# " class="btn btn-primary">修改</a>
														<a href="# " class="btn btn-primary">删除</a>
												</td>
											</tr>
											<tr>
												<td><p>6</p></td>
												<td><p>dragon</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td><p class="was-validated">2019/01/11</p></td>
												<td>桥梁监测组</td>
												<td>
														<a href="# " class="btn btn-primary">修改</a>
														<a href="# " class="btn btn-primary">删除</a>
												</td>
											</tr>
											</tbody>
										</table>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<footer class="footer">
					<div class="container-fluid">
						<nav class="pull-left">
							<ul class="nav">
								<li class="nav-item">
									<a class="nav-link" href="#">
										首页
									</a>
								</li>
								<li class="nav-item">
									<a class="nav-link" href="#">
										帮助
									</a>
								</li>
								<li class="nav-item">
									<a class="nav-link" href="#license/#free-item">
										证书
									</a>
								</li>
							</ul>
						</nav>
						<div class="copyright ml-auto">
							2019, made with <i class="la la-heart heart text-danger"></i> by <a href="#">teamF</a>
						</div>
					</div>
				</footer>
			</div>
		</div>
	</div>
	<!-- Modal -->
	<!-- AddUserModal-->
	<div class="modal fade" id="AddUser" tabindex="-1" role="dialog" aria-labelledby="modalUpdatePro" aria-hidden="true">
		<div class="modal-dialog modal-dialog-centered" role="document">
			<div class="modal-content">
				<div class="modal-header bg-primary">
					<span class="glyphicon glyphicon-user"></span>
					<h6 class="modal-title"> 
					增加用户</h6>
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
				</div>
				<div class="modal-body">
					<form>
						<div class="form-group">		
								用户名：<input type="text" class="form-control" id="InputInputAccount1" placeholder="用户名" name="userAccount">
						</div>
						<div class="form-group">
								姓名：<input type="text" class="form-control" id="InputName1" placeholder="姓名" name="userName">
						</div>
						<div class="form-group">
								所属组：<select class="form-control">
										<option>1</option>
										<option>2</option>
										<option>3</option>
										<option>4</option>
										<option>5</option>
									  </select>
						</div>
						<div class="form-group">
								邮箱：<input type="email" class="form-control" id="InputMail1" placeholder="邮箱">
						</div>
						<div class="form-group">
								电话：<input type="text" class="form-control" id="InputTel1" placeholder="电话">
						</div>
						<div class="form-group">
								密码：<input type="password" class="form-control" id="InputPwd1" placeholder="密码">
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-primary">提交</button>
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
				</div>
			</div>
		</div>
	</div>
	<!--UpdateUserModal-->
	<div class="modal fade" id="UpdateUser" tabindex="-1" role="dialog" aria-labelledby="modalUpdatePro" aria-hidden="true">
		<div class="modal-dialog modal-dialog-centered" role="document">
			<div class="modal-content">
				<div class="modal-header bg-primary">
					<h6 class="modal-title"><i class="la la-frown-o"></i> 修改用户</h6>
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
				</div>
				<div class="modal-body">
						<form>
								<div class="form-group">		
										用户名：<input type="text" class="form-control" id="InputInputAccount1" placeholder="用户名" name="userAccount">
								</div>
								<div class="form-group">
										姓名：<input type="text" class="form-control" id="InputName1" placeholder="姓名" name="userName">
								</div>
								<div class="form-group">
										所属组：<select class="form-control">
												<option>1</option>
												<option>2</option>
												<option>3</option>
												<option>4</option>
												<option>5</option>
											  </select>
								</div>
								<div class="form-group">
										邮箱：<input type="email" class="form-control" id="InputMail1" placeholder="邮箱">
								</div>
								<div class="form-group">
										电话：<input type="text" class="form-control" id="InputTel1" placeholder="电话">
								</div>
								<div class="form-group">
										密码：<input type="password" class="form-control" id="InputPwd1" placeholder="密码">
								</div>
							</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
				</div>
			</div>
		</div>
	</div>
	<!--DeleteUserModal-->
	<div class="modal fade" tabindex="-1" role="dialog" id="DeleteUser">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
			<div class="modal-header">
				<h6 class="modal-title">确认删除</h6>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
			</div>
		<div class="modal-body text-center">
			<p>确认删除该用户？</p>
		</div>
		<div class="modal-footer">
			<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
			<button type="button" class="btn btn-primary">确认</button>
		</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
	</div><!-- /.modal -->
</body>
<script src="assets/js/core/jquery.3.2.1.min.js"></script>
<script src="assets/js/plugin/jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>
<script src="assets/js/core/popper.min.js"></script>
<script src="assets/js/core/bootstrap.min.js"></script>
<script src="assets/js/plugin/chartist/chartist.min.js"></script>
<script src="assets/js/plugin/chartist/plugin/chartist-plugin-tooltip.min.js"></script>
<script src="assets/js/plugin/bootstrap-notify/bootstrap-notify.min.js"></script>
<script src="assets/js/plugin/bootstrap-toggle/bootstrap-toggle.min.js"></script>
<script src="assets/js/plugin/jquery-mapael/jquery.mapael.min.js"></script>
<script src="assets/js/plugin/jquery-mapael/maps/world_countries.min.js"></script>
<script src="assets/js/plugin/chart-circle/circles.min.js"></script>
<script src="assets/js/plugin/jquery-scrollbar/jquery.scrollbar.min.js"></script>
<script src="assets/js/ready.min.js"></script>
<script src="assets/js/demo.js"></script>
<script src="assets/layer/layer.js"></script>
<script src="assets/js/my.js"></script>
</html>